<template>
    <div class="menu-tab">
        <router-link v-for='(v,i) in routerList' :key='i' :to='v.path'>
            {{v.mate.title}}
        </router-link>
    </div>
</template>
<script>
import {mapState} from 'vuex'
export default {
    computed:{
        ...mapState(['routerList'])
    }
}
</script>
<style lang="scss" scoped>
    .menu-tab{
        width: 180px;
        border-right: 1px solid #ccc;
        display: flex;
        flex-direction: column;
        flex-shrink: 0;
        a{
            display: flex;
            height: 50px;
            justify-content: center;
            align-items: center;
            color: #000;
            text-decoration: none;
            border-bottom: 1px solid #ccc;
            background: #f3f3f3;
            &.router-link-active{
                background: #fff;
            }
        }


    }
</style>